<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" href="../layui/css/layui.css">
<script src="../layui/layui.js"></script>
	<style type="text/css">
		.imgBox img:hover
		{
			transform:scale(1.2);
		}
		a
		{
			color: #4d1299;
		}
		html,body{
			height: 100%;
		}
	</style>
	<script type="text/javascript">
        function e1(){window.open('./scatter.html');}
        function e2(){window.open('./showType.html');}
        function e3(){window.open('./showWeb.html');}
        function e4(){window.open('./queryAuthor.html');}
        function s(){
            layui.use(['layer','jquery'],function(){
                let layer = layui.layer;
                let $ = layui.jquery;
				if ($("#typeC").val()==="0"){
					layer.msg("请选择");
				}else{
                    let index = layer.load(1, {
                        shade: [0.3,'#5a5a5a'], //0.1透明度的白色背景
                        content: '正在计算'
                    });
                    // tag推荐
                    $.ajax({
						url: "/statistics/getNovelByType",
						data:{
						    type: $("#typeC").val()
						},
						success: function (res1) {
							console.info(res1);
							// 网站推荐
							$.ajax({
                                url: "/statistics/getRecommendWebsite",
                                data:{
                                    type: $("#typeC").val()
                                },
                                success: function (res2) {
                                    let content = "";

                                    //网站推荐
									content+="网站推荐指数<br/>";
									for(i=0;i<3;i++){
									    content += "&emsp;"+res2[i].name + " : " + res2[i].value.toFixed(2)+"<br/>"
									}
                                    content+="<br/>tag推荐指数<br/>";
									//只显示10个tag
                                    for(i=0;i<5;i++){
                                        if(res1[i*2].tag.length<4){
                                            if (res1[i*2].tag.length===2)
                                            	res1[i*2].tag+="&#12288;&#12288;";
											else
                                            	res1[i*2].tag+="&#12288;";
										}
                                        if(res1[i*2+1].tag.length<4){
                                            if (res1[i*2+1].tag.length===2)
                                                res1[i*2+1].tag+="&#12288;&#12288;";
											else
                                                res1[i*2+1].tag+="&#12288;";
                                        }
                                        let oneContent1 = "&emsp;"+res1[i*2].tag+" : "+res1[i*2].value.toFixed(2)+"&emsp;";
										let oneContent2 = "&emsp;"+res1[i*2+1].tag+" : "+res1[i*2+1].value.toFixed(2)+"&emsp;";
                                        content+=`<pre>${oneContent1}	${oneContent2}</pre>`;
									}

                                    console.info(res2);
                                    layer.close(index);
                                    layer.open({
                                        type: 1,
                                        skin: 'layui-layer-demo', //样式类名
                                        closeBtn: 0, //不显示关闭按钮
                                        anim: 2,
                                        shadeClose: true, //开启遮罩关闭
                                        content: content,
										area:["350px","250px"]
                                    });
                                },
                                error: function () {
                                    layer.msg("计算失败，后台超时");
                                    layer.close(index);
                                }
                            });
                        },
						error: function () {
                            layer.msg("计算失败，后台超时");
                            layer.close(index);
                        }

                    });




				}
			});
		}
	</script>

</head>
<body style="background-image: url('../image/BG.jpg');background-size:100% 100%;background-repeat:no-repeat;">
<div style="padding-left:50px">
<p style="width: 500px;margin-left: 550px;padding-top:50px;font-size:50px">网络小说分析系统</p>
	<div style="padding-top: 50px;">
	
		<select class="layui-select" id="typeC" style="width: 500px;margin-left: 430px" >
			<option value="0" selected="">选择类型，查询网站推荐指数，tag推荐指数</option>
			<option value="悬疑">悬疑</option>
			<option value="武侠" >武侠</option>
			<option value="仙侠" >仙侠</option>
			<option value="科幻" >科幻</option>
			<option value="都市" >都市</option>
			<option value="短篇" >短篇</option>
			<option value="轻小说" >轻小说</option>
			<option value="游戏竞技" >游戏竞技</option>
			<option value="军事历史" >军事历史</option>
			<option value="玄幻奇幻" >玄幻奇幻</option>
			<option value="同人小说" >同人小说</option>
			<option value="女频玄幻" >女频玄幻</option>
			<option value="女频同人" >女频同人</option>
			<option value="女频言情" >女频言情</option>
			<option value="女频古代" >女频古代</option>
			<option value="女频仙侠" >女频仙侠</option>
		</select>
		<!--<input class="layui-input-block" placeholder="选择类型，查询类型推荐指数，网站推荐指数，tag推荐指数" style="width: 500px;margin-left: 400px"/>-->
		<button class="layui-btn" style="height: 40px;margin: 0" onclick=s()>查询推荐指数</button>
	</div>
	<div style="padding-top: 100px;padding-left:50px">
		<div style="float: left;padding-left: 300px;width:600px">
			<div class="imgBox" style="float: left;height: 170px;width: 250px;/*background-color: #00F7DE;*/ padding-right: 10px; padding-top: 10px;" onclick=e1()>
				<img height="170px" width="250px" src="../image/SDT.jpg" />
			</div>
			<div class="imgBox" style="float: left;height: 170px;width: 250px;/*background-color: coral;*/ padding-right: 10px; padding-top: 10px;" onclick=e2()>
				<img height="170px" width="250px" src="../image/ZZT.jpg"/>
			</div>
			<div class="imgBox" style="float: left;height: 170px;width: 250px;/*background-color: orchid;*/ padding-right: 10px; padding-top: 10px;" onclick=e3()>
				<img height="170px" width="250px" src="../image/BZT.jpg"/>
			</div>
			<div class="imgBox" style="float: left;height: 170px;width: 250px;/*background-color: yellow;*/ padding-right: 10px; padding-top: 10px;" onclick=e4()>
				<img height="170px" width="250px" src="../image/XXCX.jpg"/>
			</div>
		</div>
		<div style="float: left;padding-left: 30px;padding-top: 12px">
			<c style="color: #7c5016">广告</c>
			<div style="padding-top: 12px"><a target="_blank" href="https://www.zhihu.com/question/19591218">
				提高文笔的最佳办法！
			</a></div>
			<div style="padding-top: 12px"><a target="_blank" href="https://www.qidian.com/">
				起点中文网，期待您的投稿
			</a></div>
			<div style="padding-top: 12px"><a target="_blank" href="https://detail.tmall.com/item.htm?spm=a220m.1000858.1000725.1.4d2651b9MBrDsX&id=570019812499&user_id=2322191136&cat_id=2&is_b=1&rn=25e69d9e5a8a032d86668ed22e4cd863">
				《一年通往作家路》7折优惠！
			</a></div>
			<div style="padding-top: 12px"><a target="_blank" href="https://www.sohu.com/a/244482297_680597">
				手把手教您网文套路，全套课程300元，现在只要130元！
			</a></div>
			<div style="padding-top: 12px"><a target="_blank" href="http://b.faloo.com/tag/7187.html">
				飞卢小说网，防盗版最好的选择
			</a></div>
			<div style="padding-top: 12px"><a target="_blank" href="https://www.baidu.com/">
				广告位招租
			</a></div>
			<div style="padding-top: 12px"><a target="_blank" href="https://www.baidu.com/">
				广告位招租
			</a></div>
			<div style="padding-top: 12px"><a target="_blank" href="https://www.baidu.com/">
				广告位招租
			</a></div>
			<div style="padding-top: 12px"><a target="_blank" href="https://www.baidu.com/">
				广告位招租
			</a></div>
			<div style="padding-top: 12px"><a target="_blank" href="https://www.baidu.com/">
				广告位招租
			</a></div>
		</div>
	</div>
</div>
</body>
</html>